import { Component, AfterViewInit, ViewChild } from '@angular/core';
import { NavController, NavParams, InfiniteScroll, Refresher, Content, Img } from 'ionic-angular';
import { Park } from '../../providers/park-data/park';
import { ParkDataProvider } from '../../providers/park-data/park-data';
import { updateImgs } from 'ionic-angular/components/content/content';
import { ParkDetailPage } from '../park-detail/park-detail';

import *as _ from "lodash";

@Component({
  selector: 'page-park-list',
  templateUrl: 'park-list.html',
})
export class ParkListPage implements AfterViewInit {
  @ViewChild(Content) _content: Content;
  parks:Park[] = [];
  private num : number =10;//每页显示记录数
  private curPage: number = 1;//当前页数
  private hasMore:boolean = true;//是否有更多数据
  private isSearch: boolean = false;

  constructor(
    public navCtrl: NavController, 
    public navParams: NavParams,
    public parkDataProvider: ParkDataProvider) {
  }

  ionViewDidLoad() {
    this.getParks(this.num,this.curPage);
  }

  getParks(num:number,page:number):void{
    this.parkDataProvider.getParks(num,page).subscribe(parks=>{
      //this.parks = parks;
      //保留原有数据
      if(parks.length >0){
        this.parks=this.parks.concat(parks);
      }else{
        this.hasMore =false;
      }
    });
  }
  /**
   * 向下滚动加载更多数据
   * @param infiniteScroll 
   */
  doInfinite(infiniteScroll:InfiniteScroll): void{
    if(!this.hasMore){
      infiniteScroll.complete();
      return;
    }
    setTimeout(()=>{
    this.curPage +=1;
    this.getParks(this.num,this.curPage);
    infiniteScroll.complete();
    },500);
  }
/**
 * 下拉刷新
 * @param refresher 
 */
  doRefresh(refresher:Refresher):void{
  setTimeout(()=>{
  this.curPage =1;
  this.getParks(this.num,this.curPage);
  refresher.complete();
  },1000);
  }

  itemTapped(park: Park):void{
    this.navCtrl.push(ParkDetailPage,{park:park});
 }

 searchParks(event:any){
  let query: string = event.target.value;
  if(query&&query.length>0){
    query = query.trim();
    this.parkDataProvider.getParksFromCache()
    .then(res=>{
      let _parks : Park[] =[];
      if(res&& res.rows && res.rows.length>0){
        console.log(`查询结果集：${res.rows.length}`);
        for(let i=0;i< res.rows.length;i++){
          _parks.push({
            objectId:res.rows.item(i).objectId,
            name:res.rows.item(i).name,
            point:res.rows.item(i).point
          }as Park);
        }
        
      }
      return _parks;
    })
    .then(parks=>{
      parks = _.filter(parks,(park:Park)=>{
        return park.name.lastIndexOf(query)>=0;
      });
      console.log(`搜索到${parks.length}条记录`);
      if(parks.length>0){
        this.isSearch = true;
        //针对多个objectID的访问
        this.parkDataProvider.getSearchParks(parks).subscribe(data=>this.parks=data);
      }
    });

  }
 }

 resetParks(event:any){
  this.curPage = 1;
 this.parks= [];
 this.getParks(this.num,this.curPage);
 this.isSearch= false;
}

  ngAfterViewInit(): void {
    //修补在Virtual-ScroLl中的图片显示问题
    if(this._content){
      this._content.imgsUpdate= ()=>{
        if(this._content._scroll.initialized && this._content._imgs.length &&
          this._content.isImgsUpdatable()){
            this._content._imgs.forEach((img:Img)=>{img._rect = null});
            updateImgs(this._content._imgs,this._content._cTop * -1,
              this._content.contentHeight,this._content.directionY,1400,400);
          }
      };
    }
    
  }

}
